<template>
  <div>
    <div class="main_content">
      <el-form id="s_form" :model="searchForm" :inline="true" ref="searchForm">
        <el-form-item prop="searchText">
          <el-input
            style="width:200px;" size='medium'
            clearable
            v-model="searchForm.searchText"
            placeholder="请输入查询关键字"
            @keydown.enter.native="doSearch()"
          ></el-input>
          <el-button size='medium' type="primary" @click="doSearch()" class="added" style='margin-left:15px;'>
            <i class="el-icon-search"></i>
            搜索
          </el-button>
        </el-form-item>
        <el-form-item>
          <el-button size='medium' v-if="showBack && searchForm.searchText" @click="resetForm()">
            <i class="el-icon-back"></i>
            清空
          </el-button>
        </el-form-item>
        <el-form-item>
          <el-button size='medium' type="primary" @click="toAdd()">
            <i class="el-icon-circle-plus-outline"></i>
            新增
          </el-button>
        </el-form-item>
      </el-form>
      <myTable
        style="margin-top:15px"
        auto='getAllList'
        son='mainTable'
        :height="Height-210"
        min-width='130'
        :myColumn=tableProp
        hide='checkbox'
        ahide='index,checkbox,mySplitPage,tooltip,background'
        slots='操作,158,right'
        select='console'
        hook:created=' myTable.tableData = tableData '
      >
        <template slot-scope='button'>
          <!-- <el-button type="success" size="mini" @click="handleDetail(button.scope.$switch, button.scope.row)">
            <i class="el-icon-view"></i>
            详 情
          </el-button> -->
          <el-button type="primary" size="mini" @click="handleEdit(button.scope.$index, button.scope.row)">
            <i class="el-icon-edit"></i>
            编 辑
          </el-button>
          <el-button type="danger" size="mini" @click="handleDelete(button.scope.$index, button.scope.row)">
            <i class="el-icon-circle-close"></i>
            删 除
          </el-button>
          <!-- <el-button type="danger" size="mini" v-if="button.scope.row.projectState==0" @click="handleDelete(button.scope.$switch, button.scope.row)">
            <i class="el-icon-circle-close"></i>
            删 除
          </el-button> -->
          <!-- <el-button
            type="info"
            size="mini"
            v-if="button.scope.row.projectState!=0"
            :disabled="button.scope.row.projectState!=0"
            @click="handleDelete(button.scope.$switch, button.scope.row)">
            <i class="el-icon-circle-close"></i>
            删 除
          </el-button> -->
        </template>
      </myTable>
    </div>
    <!--删除-->
    <el-dialog v-dialogDrag ref="dialog_isDelete" title="提示" :visible.sync="isDelete" width="32%"
               :close-on-click-modal=false>
      <span>是否删除此项目！</span>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="doDelete()">确 定</el-button>
        <el-button @click="isDelete = false">取 消</el-button>
      </span>
    </el-dialog>
    <!--新增数据-->
    <!-- <el-dialog v-dialogDrag ref="dialog_isAdd" title="新增数据" :visible.sync="isAdd" width="72%">
      <el-form :model="theAdd" :inline="true" :rules="rules" ref="ruleForm" label-width="165px">
        <el-form-item label="片区" prop="area">
          <el-select v-model="theAdd.area" placeholder="请选择片区" clearable>
            <el-option
              v-for="item in allArea"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="专业" prop="major">
          <el-select v-model="theAdd.major" placeholder="请选择片区">
            <el-option
              v-for="item in allMajor"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            ></el-option>
          </el-select>
        </el-form-item><br>
        <el-form-item label="项目名称" prop="projectName">
          <el-input v-model="theAdd.projectName" placeholder="请输入项目名称" clearable></el-input>
        </el-form-item>
        <el-form-item label="项目日期" prop="theDate">
          <el-date-picker
            v-model="theAdd.theDate"
            type="datetimerange"
            align="left"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            :picker-options="pickerOptions"
            value-format="yyyy-MM-dd hh:mm:ss"
            style="width:85%"
          ></el-date-picker>
        </el-form-item><br>
        <el-form-item label="工程名称" prop="programmeName">
          <el-input v-model="theAdd.programmeName" placeholder="请输入工程名称" clearable></el-input>
        </el-form-item>
        <el-form-item label="编号" prop="projectNumber">
          <el-input v-model="theAdd.projectNumber" placeholder="请输入编号" clearable></el-input>
        </el-form-item><br>
        <el-form-item label="供应商" prop="supplierId">
          <el-select v-model="addSS" multiple collapse-tags change="selectAll" @visible-change='arguments[0]&&supplier()' placeholder="请选择供应商" clearable>
            <div ref=z0 style="line-height: 26px" class="tCenter cPointer font14" z-hover='opacity:0.9;color:#409EFF;' @click=' addSS = addSS.length >= optionsAll.length ? [] : optionsAll.map(v=>v.value) '>
                {{ addSS.length >= optionsAll.length ? '取消全选' : '全选' }}
            </div>
            <el-option
              v-for="item in optionsAll"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            ></el-option>
            <div class="page_div" style="padding-left:20px">
              <el-button type="primary" size="mini" @click="ziDingyi()">自定义</el-button>
              <div class="page_i" @click="rightI()"  title="向下翻页">
                <i class="el-icon-arrow-down page_i_color" ></i>
              </div>
            </div>
          </el-select>
        </el-form-item><br>
        <el-form-item label="人员分配" prop="assignment">
          <el-radio v-model="theAdd.radio" label="1" border>总监 {{ theAdd.sel1.length ? `( ${theAdd.sel1.length} )` : '' }}</el-radio>
          <el-radio v-model="theAdd.radio" label="2" border >总代 {{ theAdd.sel2.length ? `( ${theAdd.sel2.length} )` : '' }}</el-radio>
          <el-radio v-model="theAdd.radio" label="3" border >监理工程师 {{ theAdd.sel3.length ? `( ${theAdd.sel3.length} )` : '' }}</el-radio>
          <el-radio v-model="theAdd.radio" label="4" border >监理员 {{ theAdd.sel4.length ? `( ${theAdd.sel4.length} )` : '' }}</el-radio>
        </el-form-item>
      </el-form>
      点击出现表格
      <div v-if="istableData2" class="showTable">
        <el-row class="table_row">
          <el-input
            size="mini"
            style="width:200px;"
            clearable
            v-model="searchText2"
            placeholder="请输入账号或姓名"
            @keydown.enter.native="doSearch2()"
          ></el-input>
          <el-button type="primary" @click="doSearch2()" class="added"  size="mini">
            <i class="el-icon-search"></i>
            搜索
          </el-button>
          <el-button type="primary" size="mini" @click="doSure2()">确 认</el-button>
        </el-row>
        <el-row style="padding:0 20px 70px 20px;">
          <myTable
            :selectable="selectable"
            :dad-son='[$1,"addTable"]'
            auto='getShowUser'
            multiple
            style='margin-top:20px'
            min-width='130'
            :myColumn=tableProp2
            ahide='switch,checkbox,mySplitPage,tooltip,background'
            slots='操作,250,right'
            @select='sel_AddTable'
            @resEnd='resEnd'
            hook:created=' myTable.tableData2 = tableData2 '
          >
          </myTable>
        </el-row>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="doAdd('ruleForm')">确 定</el-button>
        <el-button @click="isAdd = false">取 消</el-button>
      </span>
    </el-dialog> -->
    <!--新增 系统管理员 1-->
    <el-dialog v-dialogDrag ref="dialog_isAdd" :title="addOrEdit" :visible.sync="isAdd" width="60%"
               :close-on-click-modal=false :before-close='closeDialog' @opened='boolean=777' @closed='boolean=false'>
      <el-form id="new_project" :model="theAdd" :rules="rules" ref="ruleForm" :inline="true" label-width="200px">
        <el-form-item label="项目所在地" prop="projectArea">
          <el-input v-model="theAdd.projectArea" placeholder="请输入项目所在地" clearable></el-input>
        </el-form-item>
        <br>
        <el-form-item label="项目名称" prop="projectTitle">
          <el-input v-model="theAdd.projectTitle" placeholder="请输入项目名称" clearable></el-input>
        </el-form-item>
        <br>
        <el-form-item label="项目日期" prop="theDate">
          <!-- <el-date-picker
            v-model="theAdd.theDate"
            type="datetimerange"
            align="left"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            :picker-options="pickerOptions"
            value-format="yyyy-MM-dd hh:mm:ss"
            style="width:99.8%"
          ></el-date-picker>
         -->
          <el-date-picker
            v-model="theAdd.theDate"
            unlink-panels
            type="daterange"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            style="width:99.8%"
            value-format="yyyy-MM-dd"
          >
          </el-date-picker>
        </el-form-item>
        <br>
        <!-- <el-form-item label="项目编号" prop="projectNumber">
          <el-input v-model="theAdd.projectNumber" placeholder="请输入项目编号" clearable></el-input>
        </el-form-item><br> -->
        <el-form-item label="分配项目管理员" prop="userId">
          <el-input :value="theAdd.userId.reduce((a,v)=>a+'、'+v.userName,'').slice(1)" placeholder="请选择项目管理员" readonly
                    @click.native="addTableshowAdd()">
          </el-input>
        </el-form-item>
      </el-form>
      <!-- 点击出现表格 -->
      <div v-if="istableDataAdd" class="showTable">
        <el-row class="table_row">
          <el-form id="s_form" :model="searchForm2" :inline="true" ref="searchForm2">
            <el-form-item prop="searchText2">
              <el-input
                size="mini"
                style="width:200px;"
                clearable
                v-model="searchForm2.searchText2"
                placeholder="请输入账号或姓名"
                @keydown.enter.native="doSearch2()"
              ></el-input>
              <el-button type="primary" @click="doSearch2()" class="added" size="mini">
                <i class="el-icon-search"></i>
                搜索
              </el-button>
            </el-form-item>
            <el-form-item>
              <el-button v-if="showBack2" @click="doReturn2()" size="mini">
                <i class="el-icon-back"></i>
                返回
              </el-button>
            </el-form-item>
          </el-form>
        </el-row>
        <el-row style="padding:0 10px 70px 10px;"><!-- @select='theAdd.userId=arguments[0] || {}'-->
          <myTable
            multiple
            :dad-son='[$1,"addTable"]'
            auto='getShowUser'
            style='margin-top:10px'
            min-width='130'
            :myColumn=tableProp2
            ahide='index,checkbox,mySplitPage,tooltip,background'
            slots='操作,250,right'
            @select='
              arguments[1].tableData.forEach(v=>v._sel=false),
              !arguments[2]._selected || boolean === false
              ? ( theAdd.userId.forEach((v,i,t)=>(v = arguments[1].tableData.find(v2=>v2.userId===v.userId), v && ( ( t[i] = v )._sel = true))), boolean === 777 && theAdd.userId.push(arguments[2].with("_sel",true)) )
              : theAdd.userId = theAdd.userId.reduce((a,v,vv)=>v.userId!==arguments[2].userId ? ( vv = arguments[1].tableData.find(v2=>v2.userId===v.userId), vv ? ( ( a[a.length++] = vv )._sel = true ) : a.push(v), a ) : a,[])
            '
            @resEnd='resEnd0'
            :selectable="selectable"
            hook:created=' myTable.tableData2 = tableData2 '
          >
          </myTable>
        </el-row>
      </div>
      <span slot="footer" class="dialog-footer">
          <el-button size='medium' icon='el-icon-success' type="primary" @click="doAdd('ruleForm')">确 定</el-button>
        <!-- <el-button @click="isAdd = false">取 消</el-button> -->
          <el-button size='medium' @click="addFalse('ruleForm')" style='margin-left:15px;'>取 消</el-button>
        </span>
    </el-dialog>

    <!--修改 系统管理员 1 @closed=''-->
    <el-dialog v-dialogDrag ref="dialog_isAdd" title="修改数据" :visible.sync="isEdit" width="60%"
               :close-on-click-modal=false @opened='boolean=777' @closed='boolean=false'>
      <el-form id="new_project" :model="theEdit" :rules="rules" :inline="true" ref="ruleForm" label-width="200px">
        <el-form-item label="项目所在地" prop="area">
          <el-input v-model="theEdit.area" placeholder="请输入项目所在地" clearable></el-input>
        </el-form-item>
        <br>
        <el-form-item label="项目名称" prop="projectName">
          <el-input v-model="theEdit.projectName" placeholder="请输入项目名称" clearable></el-input>
        </el-form-item>
        <br>
        <el-form-item label="项目日期" prop="editDate">
          <!-- <el-date-picker
            v-model="theEdit.editDate"
            type="datetimerange"
            align="left"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            :picker-options="pickerOptions"
            value-format="yyyy-MM-dd hh:mm:ss"
            style="width:99.8%"
          ></el-date-picker> -->
          <el-date-picker
            v-model="theEdit.editDate"
            unlink-panels
            type="daterange"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            style="width:99.8%"
            value-format="yyyy-MM-dd"
          >
          </el-date-picker>
        </el-form-item>
        <br>
        <el-form-item label="分配项目管理员" prop="projectLeaderName">
          <el-input :value="theEdit._list && theEdit._list.reduce((a,v)=>a+'、'+v.userName,'').slice(1)" readonly
                    @click.native="addTableshow()"></el-input>
        </el-form-item>
      </el-form>
      <!-- 点击出现表格 -->
      <div v-if="istableData2" class="showTable">
        <el-row class="table_row">
          <el-form id="s_form" :model="searchForm2" :inline="true" ref="searchForm2">
            <el-form-item prop="searchText2">
              <el-input
                size="mini"
                style="width:200px;"
                clearable
                v-model="searchForm2.searchText2"
                placeholder="请输入账号或姓名"
                @keydown.enter.native="doSearch2()"
              ></el-input>
              <el-button type="primary" @click="doSearch2()" class="added" size="mini">
                <i class="el-icon-search"></i>
                搜索
              </el-button>
            </el-form-item>
            <el-form-item>
              <el-button v-if="showBack2 && searchForm2.searchText2" @click="doReturn2()" size="mini">
                <i class="el-icon-back"></i>
                清空
              </el-button>
            </el-form-item>
          </el-form>
          <!-- <el-button type="primary" size="mini" @click="doSure2()">确 认</el-button> -->
        </el-row>
        <el-row style="padding:0 10px 70px 10px;"><!--  @select='selectEdit' -->
          <myTable
            multiple
            :dad-son='[$1,"editTable"]'
            auto='getShowUser2'
            style='margin-top:10px'
            min-width='130'
            :myColumn=tableProp2
            ahide='index,checkbox,mySplitPage,tooltip,background'
            slots='操作,250,right'
            @select='
              arguments[1].tableData.forEach(v=>v._sel=false),
              !arguments[2]._selected || boolean === false
              ? ( theEdit._list.forEach((v,i,t)=>(v = arguments[1].tableData.find(v2=>v2.userId===v.userId), v && ( ( t[i] = v )._sel = true))), boolean === 777 && theEdit._list.push(arguments[2].with("_sel",true)) )
              : theEdit._list = theEdit._list.reduce((a,v,vv)=>v.userId!==arguments[2].userId ? ( vv = arguments[1].tableData.find(v2=>v2.userId===v.userId), vv ? ( ( a[a.length++] = vv )._sel = true ) : a.push(v), a ) : a,[])
            '
            :selectable="selectable2"
            hook:created=' myTable.tableData2 = tableData2 '
            @resEnd='resEnd'
          >
          </myTable>
        </el-row>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button size='medium' icon='el-icon-success' type="primary" @click="doEdit('ruleForm')">确 定</el-button>
        <el-button size='medium' @click="isEdit = false">取 消</el-button>
      </span>
    </el-dialog>

  </div>
</template>
<script>
import {msgWarning} from "../../utils/myhttp";
// console.error(arguments);
export default {
  data() {
    return {
      loading: "",
      tableHeaderStyle: {
        //表头样式
        "background-color": "rgb(242,242,242)"
      },
      multipleSelection: [], //多选
      theRow: {}, //当前行数据
      theIndex: 0, //当前下标
      multiIDS: [], //多选
      addSS: [],
      editSS: [],
      theAdd: {
        userId: [],
        userNames: '',
        last: []
      }, //新增数据
      isAdd: false, //是否新增
      isDelete: false, //是否删除
      hasMultiDelete: false, //是否多选
      searchForm: {
        searchText: "", //搜索字段
      },

      myTotal: 1, //分页总条数，默认1
      currentPage: 1, //初始化当前页
      nowPage: 1, //当前页
      thePageSize: 15, //每页条数
      tableData: [],
      tableProp: [
        {label: "项目所在地", prop: "area", sort: true},
        {label: "项目名称", prop: "projectName", sort: true},
        {label: "创建时间", prop: "createTime", sort: true, width: 180},
        {label: "项目开始日期", prop: "startTime", sort: true, width: 180},
        {label: "项目管理员", prop: "projectLeaderName", sort: true},
        {label: "编号", prop: "projectNumber"},
        {
          label: "状态", prop: "projectState", html(prop) {
            if (prop === 1) {
              return '<span style="color:red">正在进行</span>'
            } else if (prop === 2) {
              return '<span style="color:blue">已完成</span>'
            } else if (prop === 0)
              return '<span style="color:green">未开始</span>'
          }
        },
        {label: "创建人", prop: "createPerson"},
        // { label: "工程名称", prop: "programmeName" },
      ],
      rules: {
        //表单验证
        projectArea: [
          {required: true, message: "请输入项目所在地", trigger: "blur"},
        ],
        theDate: [
          {required: true, message: "请选择项目日期", trigger: "change"}
        ],
        projectTitle: [
          {required: true, message: "请输入项目名称", trigger: "blur"}
        ],
        userId: [
          {required: true, message: "请选择项目管理员", trigger: "change"}
        ],
      },
      //供应商
      //状态
      status: [
        {value: 0, label: "未开始"},
        {value: 1, label: "正在进行"},
        {value: 2, label: "已完成"},
      ],
      //供应商
      allSupplier: [],
      theEdit: {
        // projectLeaderName:{
        // }
        editDate: [],
      },
      isEdit: false,
      searchForm2: {
        searchText2: "",
      },
      tableData2: [],
      istableData2: false,
      istableDataAdd: false,
      istableDatatwo2: false,
      tableProp2: [
        {label: "姓名", prop: "userName"},
        {
          label: "专业", prop: "userMajorInfoList", html(prop) {
            return Return(prop, (a, v) => a + '、' + v.majorName, '').slice(1);
          }
        },
        {label: "岗位", prop: "post"},
        // { label: "账号", prop: "phoneNumber" },
        // { label: "角色", prop: "roleId", html(prop) {
        //   return prop === 1 ? '<span>系统管理员</span>' : '<span>项目管理员</span>';
        // } },
        // { label: "状态", prop: "userState", html(prop) {
        //   return prop === 1 ? '<span style=color:green>正常</span>' : '<span style=color:red>注销</span>';
        // } },
      ],
      //修改人员分配
      isEditTable: false,
      isEditTable2: false,
      tableProp3: [
        {label: "姓名", prop: "name"},
        {label: "角色", prop: "name", html: '吼吼'},
        {label: "权限", prop: "payCode", html: '请付钱!!'},
        {label: "状态", prop: "department", html: '呼呼'},
      ],
      tableData3: [],
      theDate: "", //日期范围
      userIdRow: '',
      supplierItems: '',
      theDate: "", //日期范围
      pickerOptions: {
        shortcuts: [
          {
            text: "最近一周",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "最近一个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "最近三个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit("pick", [start, end]);
            }
          }
        ]
      },
      showBack: false,
      showBack2: false,
      addOrEdit: "新增项目",
    };
  },
  components: {},
  watch: {
    // 'theAdd.userId'(val) {
    //   this.showChief(val);
    // }
  },
  methods: {
    //勾选限定问题
    selectable(row, index) {
      if (this.theAdd.userId.length < 3) return row._selectable = true;
      return row._selectable = row._sel;
    },
    selectable2(row, index) {
      if (this.theEdit._list.length < 3) return row._selectable = true;
      return row._selectable = row._sel;
    },
    resetForm() {
      this.$refs.searchForm.resetFields()
      this.getAllList();
      this.showBack = false;
    },
    doReturn2() {
      this.$refs.searchForm2.resetFields()
      this.getShowUser();
      this.showBack2 = false;
    },
    //===============修改 人员分配 相关事件===========================
    //input点击事件  一级隐藏 显示
    showTable() {
      this.isEditTable = !this.isEditTable
    },
    //二级隐藏 显示
    editShowTableData() {
      this.isEditTable2 = !this.isEditTable2
    },

    //自定义跳转页面
    ziDingyi() {
      this.$router.push({name: "supplierManagement"});
    },
    // resEnd(son,tableData) {
    //   const A = this.theAdd['sel'+this.lastPositionType];
    //   son.toggleSel.sleep(
    //     0,
    //     mapArr(
    //       A,
    //       v=>( v = v.userId ) && tableData.find( v2=>v2.userId===v )
    //     )
    //   );
    // },

    sel_AddTable() {
      // console.error(arguments[0]);
      const theAdd = this.theAdd;
      const sel = theAdd.radio * 1;
      const A = theAdd["sel" + sel] = arguments[0];
      Loop(i => {
        if (i === sel) return;
        i = "sel" + i;
        theAdd[i] = mapArr(theAdd[i], v => (i = v.userId) && !A.find(v2 => v2.userId === i) && v);
      }, 1, 4, 1);
    },

    //========================== 系统管理员 新增 =========================================
    //分配管理员 显示隐藏表格 新增
    addTableshowAdd() {
      this.istableDataAdd = true;
      // const theAdd = this.theAdd;
      // const sel = theAdd.userId * 1;
    },
    //分配管理员 显示隐藏表格 修改
    addTableshow() {
      this.istableData2 = true;
      // const theAdd = this.theAdd;
      // const sel = theAdd.userId * 1;
    },
    //点击表格 获取当前行id
    sel_AddTableOne(row) {
      this.userIdRow = row;
      // const theAdd = this.theAdd;
      // const sel = theAdd.userId * 1;
      // const A = theAdd["sel"+sel] = arguments[0];
      // Loop(i=>{
      //   if( i === sel ) return;
      //     i = "sel" + i;
      //     theAdd[i] = mapArr( theAdd[i], v=>( i = v.userId ));
      // });
    },
    showChief(positionType) {
      this.lastPositionType = positionType;
      if (this.istableData2 === false) return this.istableData2 = true; //第一次显示
      // console.log( this.istableData2 );
      // this.addTable.clearSelection();
      this.getShowUser(); //已经在显示， 刷新数据即可
    },
    getShowUser2: async function (pageNum, pageSize) {
      // console.error(this.theAdd.userId);
      // console.error(pageNum,pageSize);
      var res = await $.post('getUserProject', {
        pageNum,
        pageSize,
        projectId: '',
        positionType: this.lastPositionType,
        searchText: this.searchForm2.searchText2,
      });
      // console.error(this.theAdd.userId);
      $return('__', res);
    },
    //获取用户列表
    getShowUser: async function (pageNum, pageSize) {
      // console.error(this.theAdd.userId);
      // console.error(pageNum,pageSize);
      var res = await $.post('getUserProject', {
        pageNum,
        pageSize,
        projectId: '',
        positionType: this.lastPositionType,
        searchText: this.searchForm2.searchText2,
      });
      // console.error(this.theAdd.userId);
      $return('__', res);
    },
    doAdd(formName) {
      //新增
      this.$refs[formName].validate(valid => {
        if (valid) {
          if (this.addOrEdit == "新增项目") {
            this.addFunction(); //新增
            //this.$refs['ruleForm'].resetFields();
          }
        } else {
          msgWarning(this, "请填写必要信息！");
          return false;
        }
      });
    },
    closeDialog() {
      this.$nextTick(() => {
        this.isAdd = false;
        this.$refs["ruleForm"].resetFields();
      });
    },
    //新增取消
    addFalse() {
      this.isAdd = false;
      this.$refs['ruleForm'].resetFields();
    },
    //新增确定方法
    addFunction: async function () {
      const theAdd = this.theAdd;
      var res = await $.post('addProject', {
        area: theAdd.projectArea, //项目所在地
        createPerson: localStorage.getItem('loginName'),
        projectLeaderId: theAdd.userId.reduce((a, v) => a + ',' + v.userId, '').slice(1),
        projectName: theAdd.projectTitle,
        startTime: theAdd.theDate[0], //开始日期
        endTime: theAdd.theDate[1], //结束日期
        projectNumber: '',
      });
      this.isAdd = false;
      this.getAllList();
      this.$refs['ruleForm'].resetFields();

      function joinUser(theAdd) {
        var res = [];
        Loop(i => {
          res = res.concat(theAdd['sel' + i].map(v => ({userId: v.userId, positionType: i})));
        }, 1, 4, 1);
        return res;
      };
    },
    toAdd() {
      //调起新增弹窗
      // this.istableDataAdd = false;
      this.addOrEdit = "新增项目";
      this.isAdd = true;
      this.getShowUser();
    },
    //隐藏的表的查询
    doSearch2() {
      this.getShowUser();
      this.showBack2 = true;
    },
    //=====================================详情===================================
    handleDetail(index, row) {
      var data = row.projectUserInfoList || [];
      var str = '';
      var str2 = '';
      var str3 = '';
      var str4 = '';
      for (var i = 0; i < data.length; i++) {
        this.alldata = data[i];
        if (data[i].positionType === '1') {
          str += '、' + (data[i].userName || "");
        } else if (data[i].positionType === '2') {
          this.agency = (data[i].positionName || "") + ' -- ';
          str2 += '、' + (data[i].userName || "");
          this.symbol = '；';
        } else if (data[i].positionType === '3') {
          this.engineer = (data[i].positionName || "") + ' -- ';
          str3 += '、' + (data[i].userName || "");
          this.symbol3 = '；';
        } else if (data[i].positionType === '4') {
          this.supervisor = (data[i].positionName || "") + ' -- ';
          str4 += '、' + (data[i].userName || "");
          this.symbol4 = '；';
        }
      }
      ;
      this.$router.push({
        name: "projectRecord",
        params: {
          user_all: str.slice(1),
          project_name: row.projectName,
          // programme_name: row.programmeName,
          project_number: row.projectNumber,
          project_id: row.projectId,
          user_all2: str2.slice(1),
          user_all3: str3.slice(1),//监理工程师
          user_all4: str4.slice(1),//监理员
          // projectLeaderName:row.projectLeaderName,
          // startTime:row.startTime,
          // endTime:row.endTime,
          agency: this.agency,
          engineer: this.engineer,
          supervisor: this.supervisor,
          symbol: this.symbol,
          symbol3: this.symbol3,
          symbol4: this.symbol4,
        }
      });
    },
    handleMultiDelete() {
      this.isDelete = true;
    },
    handleDelete(index, row) {
      this.isDelete = true;
      this.theRow = row;
    },
    doDelete: async function () {
      var res = await $.post('deleteProject', {
        projectId: this.theRow.projectId,
        deletePerson: localStorage.getItem('loginName'),
      });
      if (!res.success) return $.msgError(res.msg || 'error!');
      $.msgSuccess(res.msg || 'success!');
      this.isDelete = false;
      this.getAllList();
    },
    // selectEdit(A) {
    //   A = A || [];
    //   const theEdit = this.theEdit;
    //   theEdit.projectLeaderName = (A.userName||"") + '、';
    //   theEdit.projectLeaderId = A.userId||'';
    // },
    //=========================系统管理员 修改=================================================
    handleEdit(inde, row) {
      row = myClone.deep(row);
      row.editDate = [row.startTime || '', row.endTime || ''];
      const ids = (row.projectLeaderId || '').split(',');
      row._list = (row.projectLeaderName || '').split('、').map((v, i) => {
        return {userId: ids[i], userName: v};
      });
      this.theEdit = row;
      this.isEdit = true;
      this.getShowUser2();
      // this.isEdit = true;
      // console.error(row,row._list,ids);
      // this.istableData2 = false;
    },
    //存在的数据勾选(编辑)
    resEnd0(son, tableData) {
      let U, O = Return(U = this.theAdd.userId, (a, v) => a[v.userId] = true, {__proto__: null}), T = [];
      tableData.forEach(v => (v._sel = O[v.userId] || false) && T.push(v));
      // console.error(O,T,tableData);
      son.$nextTick(() => {
        son.toggleSel(T);
      });
    },
    //存在的数据勾选(编辑)
    resEnd(son, tableData) {
      let U, O = Return(U = this.theEdit._list, (a, v) => a[v.userId] = true, {__proto__: null}), T = [];
      tableData.forEach(v => (v._sel = O[v.userId] || false) && T.push(v));
      // console.error(O,T,tableData);
      son.$nextTick(() => {
        son.toggleSel(T);
      });
      /*tableData.forEach(v=>v._sel=false);
      son.$nextTick(()=>{
        son.toggleSel(
          mapArr(
            this.theEdit._list,
            v=>( v = v.userId ) && tableData.find( v2=>v2.userId===v && (v2._sel=true) )
          )
        );
      });*/
    },
    doEdit: async function () {
      var res = await $.post('updateProject', {
        projectId: this.theEdit.projectId,
        projectLeaderId: this.theEdit._list.reduce((a, v) => a + ',' + v.userId, '').slice(1),
        area: this.theEdit.area, //项目所在地
        projectName: this.theEdit.projectName,//工程名称
        projectNumber: '',
        projectState: this.theEdit.projectState,
        createTime: this.theEdit.createTime,
        createPerson: this.theEdit.createPerson,
        userIdList: JSON.stringify([]),
        supplierIdList: JSON.stringify([]),
        startTime: this.theEdit.editDate[0], //开始日期
        endTime: this.theEdit.editDate[1], //结束日期
      });
      if (!res.success) return $.msgError(res.msg || 'error!');
      this.isEdit = false;
      this.getAllList();
    },
    doSearch() {
      //搜索方法
      this.getAllList();
      this.showBack = true;
    },

    goBack() {
      this.$router.go(-1);
    },
    openLoading() {
      //loading请求等待
      this.loading = this.$loading({
        lock: true,
        text: "Loading",
        spinner: "el-icon-loading",
        background: "rgba(0, 0, 0, 0.7)"
      });
    },
    getAllList: async function (pageNum, pageSize) {
      var res = await $.post('getAllProject', {
        pageNum, //当前页
        pageSize,//每页显示条数
        searchText: this.searchForm.searchText//搜索文本
      });
      // forArr(res.items,v=>v.editDate=[v.startTime||'',v.endTime||'']);
      $return('__', res);
      // res = res.items;
    },
  },
  created() {
  },
  mounted() {
  }
};
</script>
<style scoped>
.assignment_parent {
  width: 193px;
  padding: 12px;
  background: #E1E1E1
}

.child_div {
  text-align: center;
  padding: 0 10px;
  background: #FAFAFA;
  margin-bottom: 8px;
}

.child_div_last {
  text-align: center;
  padding: 0 10px;
  background: #FAFAFA;
}

.child_div span,
.child_divTwo span {
  color: #000;
}

.child_div_last span,
.child_div_lastTwo span {
  color: #000;
}

/*显示隐藏表格*/
.showTable {
  border: 1px solid #d4d4d4;
  margin-top: 10px;
  width: 100%;
  /*margin-left:110px;*/
}

.table_row {
  border-bottom: 1px solid #d4d4d4;
  padding-left: 10px;
}

/*修改 二级隐藏表格*/
.showTableTwo {
  border: 1px solid #d4d4d4;
}

.child_divTwo {
  text-align: center;
  padding: 6px 10px;
  background: #FAFAFA;
  margin-bottom: 8px;
}

.child_div_lastTwo {
  text-align: center;
  padding: 6px 10px;
  background: #FAFAFA;
}

/*新增 供应商选择 分页*/
.page_div {
  border-top: 1px solid #d4d4d4;
  margin-top: 10px;
  display: flex;
  justify-content: space-between;
  padding: 10px 10px 0 10px;
}

.page_i {
  /*background:#7BB6D5;*/
  background: #367FA8;
  height: 24px;
  padding: 0 5px;
  cursor: pointer;
  border-radius: 50%;
}

.page_i:hover {
  opacity: 0.8
}

.page_i_color {
  line-height: 24px;
  color: #fff
}
</style>


